<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>成语大赛</title>
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="//at.alicdn.com/t/c/font_4427063_exvq9lyehkf.css">
    <script src="js/function.js"></script>
    <script src="js/rank.js"></script>
</head>

<body>
    <div class="whole-box">
        <div class="rank-box">
            <img src="images/rank.png" alt="" class="arrow rotateBack">
        </div>
        <div class="rank hidden">
            <h2>排行榜</h2>
            <ul class="rank-num">
                <li class="item" id="item-title">
                    <div>排名</div>
                    <div>玩家信息</div>
                    <div>得分</div>
                </li>
                <li class="item">
                    <div class="num">1</div>
                    <div class="rank-mem">
                        <img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>
                </li>
                <li class="item">
                    <div class="num">2</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
                <li class="item">
                    <div class="num">3</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
                <li class="item">
                    <div class="num">4</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
                <li class="item">
                    <div class="num">5</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
                <li class="item">
                    <div class="num">6</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
                <li class="item">
                    <div class="num">7</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
                <li class="item">
                    <div class="num">8</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
                <li class="item">
                    <div class="num">9</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
                <li class="item">
                    <div class="num">10</div>
                    <div class="rank-mem"><img src="images/ex-rank.jpg" alt="">
                        <p>hhh</p>
                    </div>
                    <div class="score">20</div>

                </li>
            </ul>
        </div>
        <div class="game-box">
            <div class="logo">
                <p>成语大赛</p>
            </div>
            <div class="single-box box">
                <img class="doll s-doll" src="images/single.png" alt="">
                <p>单人模式</p>
            </div>
            <div class="double-box box">
                <img class="doll d-dolls" src="images/double.png" alt="">
                <p>对战模式</p>
            </div>
        </div>
        <div class="message-box">
            <img src="images/img.jpg" alt="" class="img">
            <p class="name">忧郁的卷心菜</p>
        </div>

    </div>

</body>

</html>